<template>
	<div class="city-header">
		<div class="header-left">
			<router-link to="/">
				<i class="iconfont">&#xe613;</i>
			</router-link>
			<span>城市选择</span>
		</div>
		<div class="header-bottom">
			<ul>
				<li>境内</li>
				<li>境外·港澳台</li>
			</ul>
		</div>
	</div>
</template>
<script>

</script>
<style scoped>
	.city-header{
		background:#00bcd4;
	}
	.header-left{		
		height:0.88rem;
		position:relative;
	}
	.header-left i{
		position:absolute;
		left:.2rem;
		top:0;
		display:block;
		color:#fff;
		font-size:0.4rem;
		line-height:0.88rem;
	}
	.header-left span{
		position:absolute;
		top:0;
		left:50%;
		transform:translate(-50%,0);
		color:#fff;
		display:block;
		font-size:0.32rem;
		line-height:0.88rem;
	}
	.header-bottom{
		line-height: .4rem;
    	background-color: #00bcd4;
    	padding: .2rem 1rem;
    	color: #fff;
	}
	.header-bottom ul{
		border:solid 1px #fff;
		border-radius:0.03rem;
		overflow:hidden;
	}
	.header-bottom li{
		font-size:0.28rem;
		text-align:center;
		float:left;
		width:50%;
	}
	.header-bottom ul li:first-child{
		background:#fff;
		color:#00bcd4;
	}
</style>